{% extends "base.html" %}

{%block title%}Tworzenie nowej wizyty{%endblock%}

{%block head%}
	<link rel="stylesheet" href="{{MEDIA_URL}}/css/jquery-ui.css" type="text/css" media="all" />
	<script src="{{MEDIA_URL}}/js/jquery.min.js" type="text/javascript"></script>
	<script src="{{MEDIA_URL}}/js/jquery-ui.min.js" type="text/javascript"></script>
	<script>
		$(function () {
			$("#user").autocomplete ({
				source: "{%url visit-autocomplete%}",
				minLength: 3,
				select: function (e, ui) {
					$("#user").val (ui.item.label);
					$("#id_profile").val (ui.item.value);
					return false;
				}
			});
		});
	</script>
{% endblock %}

{% block content %}
	<div id="content">
		<h2>Tworzenie nowej wizyty</h2>
		<form method="POST" action="" class="add-edit-form">
			{% csrf_token %}
			<table class="form">
				<tr>
					<th>Data wizyty:</th>
					<td style="padding:5px; text-indent:5px">{{data.date}}</td>
				</tr>
				<tr>
					<th>Pacjent:</th>
					<td>
						{%if data.name%}
							{{data.name}}
						{%else%}
							<input type="text" id="user" size="40">
						{%endif%}
					</td>
				</tr>				
				{{form}}
				<tr>
					<td class="ta-r" colspan="2">
						<button type="submit" formaction="javascript:history.back()" class="f-l" style="margin-top:5px">Wstecz</button>
						<input type="submit" value="Dodaj wizytę">
					</td>
				</tr>
			</table>
		</form>
	</div>
{% endblock %}
